<!DOCTYPE html>
<html lang="en">
<!-- 消防物资类型 -->

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>消防员管理</title>
    <link rel="icon" href="../static/img/icon.png">
    <link rel="stylesheet" href="../static/js/layui/css/layui.css">
    <link rel="stylesheet" href="../static/css/animate.min.css">
    <link rel="stylesheet" href="../static/css/style.css">

    <style>
        .layui-form-pane>.form-item {
            margin: 0.2rem 0;
        }

        .photo-con {
            background: #2c4b55;
            margin-left: 0.2rem !important;
            margin-right: 0.2rem !important;
            margin-top: calc(0.21rem + 16px) !important;
            width: calc(33.3% - 0.4rem);
            height: calc(2.65rem + 80px);
            border-radius: 2px;
            box-shadow: 2px 2px 5px #0006;
        }

        .m {
            height: 100%;
            background-image: url(../static/img/photo.png);
            background-size: 2rem;
            background-repeat: no-repeat;
            width: 100%;
            background-position: center;
            display: flex;
            align-items: center;
            justify-content: center;
            overflow: auto;
        }

        .layui-col-xs12.layui-padding-3 {
            margin: 0;
            padding-top: 0 !important;
        }

        .contain-table-tool {
            height: 1.5rem;
        }

        .contain-table-tool>form {
            background:
                linear-gradient(to right, rgba(0, 0, 0, 0), rgba(2, 36, 55, 0.8));
            padding-left: 0.05rem;
            flex-wrap: wrap;
            justify-content: space-between;
        }

        .layui-form input {
            width: 1.85rem;
        }

        .contain-table-list {
            height: calc(100% - 2rem);
        }

        #edit-offset {
            overflow: hidden;
        }
    </style>
</head>

<body>
    <div class="app" style="overflow: hidden;">
        <div class="header animate__animated animate__slideInDown">
            <div class="header-title">训战研判系统平台</div>
            <div class="header-menu">

            </div>
        </div>
        <div class="contain">
            <div class="contain-menu animate__animated animate__slideInLeft">

            </div>
            <div class="contain-table">
                <div class="contain-table-tool">
                    <form class="layui-form" action="">
                        <div class="form-item">
                            <input type="text" name="name" placeholder="消防员姓名" class="layui-input" lay-affix="clear" />
                        </div>
                        <div class="form-item">
                            <input type="text" name="rfidName" placeholder="rfid号" class="layui-input"
                                lay-affix="clear" />
                        </div>
                        <select name="professionalTitle" lay-filter="formSelect">
                            <option value="">消防救援衔</option>
                            <optgroup label="管理指挥">
                                <option value="111">指挥员</option>
                            </optgroup>
                            <optgroup label="专业技术">
                                <option value="201">一级消防长</option>
                                <option value="202">二级消防长</option>
                                <option value="203">三级消防长</option>
                                <option value="204">一级消防士</option>
                                <option value="205">二级消防士</option>
                                <option value="206">三级消防士</option>
                                <option value="207">四级消防士</option>
                                <option value="208">预备消防士</option>
                            </optgroup>
                        </select>
                        <select name="post" lay-filter="formSelect">
                            <option value="">职务
                            </option>
                            <option value="1">站长</option>
                            <option value="2">指导员</option>
                            <option value="3">副站长</option>
                            <option value="4">站长助理</option>
                            <option value="5">正班长</option>
                            <option value="6">副班长</option>
                            <option value="7">消防员</option>
                        </select>
                        <select name="positionalPosition" lay-filter="formSelect">
                            <option value="">专业岗位</option>
                            <option value="1">消防指挥</option>
                            <option value="2">灭火攻坚</option>
                            <option value="3">装备维护</option>
                            <option value="4">通信</option>
                            <option value="5">驾驶</option>
                        </select>
                        <select name="education" lay-filter="formSelect">
                            <option value="">受教育程度
                            </option>
                            <option value="1">本科</option>
                            <option value="2">本科在读</option>
                            <option value="3">高中</option>
                            <option value="4">大专</option>
                            <option value="5">大专在读</option>
                            <option value="6">中专</option>
                            <option value="7">硕士</option>
                            <option value="8">硕士在读</option>
                        </select>
                        <select name="politicalStatus" lay-filter="formSelect">
                            <option value="">政治面貌
                            </option>
                            <option value="1">党员</option>
                            <option value="2">团员</option>
                            <option value="3">群众</option>
                        </select>
                        <select name="vacationStatus" lay-filter="formSelect">
                            <option value="">休假情况
                            </option>
                            <option value="1">驻地轮休</option>
                            <option value="2">休假</option>
                        </select>
                        <select name="hasHouse" lay-filter="formSelect">
                            <option value="">有无房产
                            </option>
                            <option value="2">有</option>
                            <option value="1">无</option>
                        </select>
                        <select name="hasLoan" lay-filter="formSelect">
                            <option value="">有无贷款
                            </option>
                            <option value="2">有</option>
                            <option value="1">无</option>
                        </select>
                        <select name="maritalStatus" lay-filter="formSelect">
                            <option value="">婚姻情况
                            </option>
                            <option value="1">未婚</option>
                            <option value="2">已婚</option>
                        </select>
                        <select name="hasChild" lay-filter="formSelect">
                            <option value="">有无子女
                            </option>
                            <option value="2">有</option>
                            <option value="1">无</option>
                        </select>

                        <div class="layui-btn" lay-submit lay-filter="search"><img src="../static/img/icon2.png">查询
                        </div>
                        <button type="reset" id="resetSearch" class="layui-btn"><img
                                src="../static/img/icon3.png">重置</button>
                        <div class="layui-btn add" onclick="tableHandle(3)"><img src="../static/img/icon1.png">新增
                        </div>

                    </form>
                </div>
                <div class="contain-table-list">
                    <table id="table" lay-filter="table"></table>
                </div>

                <script type="text/html" id="add-temp">
                    <form class="layui-form layui-form-pane layui-col-space4" id="add-form"  lay-filter="editForm"  action="">
                        <div class="form-item layui-padding-2 layui-col-xs5 photo-con">
                           <div class="m" onclick="$('#upload-input').click()">
                            </div>
                        </div>
                        <div class="form-item layui-padding-2 layui-col-xs8">
                            <div class="form-item layui-padding-2 layui-col-xs6">
                                <label class="layui-form-label">姓名</label>
                                <div class="layui-input-block">
                                    <input type="text" name="name" lay-affix="clear" placeholder="请输入" lay-verify="required"
                                        class="layui-input">
                                </div>
                            </div>
                            <div class="form-item layui-padding-2 layui-col-xs6">
                                    <label class="layui-form-label">性别</label>
                                    <div class="layui-input-block">
                                        <select name="gender" lay-filter="">
                                            <option value=""></option>
                                            <option value="1">男</option>
                                            <option value="2">女</option>
                                        </select>
                                    </div>
                            </div>
                            <div class="form-item layui-padding-2 layui-col-xs6">
                                <label class="layui-form-label">民族</label>
                                <div class="layui-input-block">
                                    <input type="text" name="nation" lay-affix="clear" placeholder="请输入"
                                        class="layui-input">
                                </div>
                            </div>
                            <div class="form-item layui-padding-2 layui-col-xs6">
                                <label class="layui-form-label">籍贯</label>
                                <div class="layui-input-block">
                                    <input type="text" name="nativePlace" lay-affix="clear" placeholder="请输入"
                                        class="layui-input">
                                </div>
                            </div>
                            <div class="form-item layui-padding-2 layui-col-xs6">
                                <label class="layui-form-label">职务</label>
                                <div class="layui-input-block">
                                    <select name="post" lay-filter="">
                                        <option value=""></option>
                                        <option value="1">站长</option>
                                        <option value="2">指导员</option>
                                        <option value="3">副站长</option>
                                        <option value="4">站长助理</option>
                                        <option value="5">正班长</option>
                                        <option value="6">副班长</option>
                                        <option value="7">消防员</option>
                                    </select>
                                </div>
                            </div>
                            <div class="form-item layui-padding-2 layui-col-xs6">
                                <label class="layui-form-label">专业岗位</label>
                                <div class="layui-input-block">
                                    <select name="positionalPosition" lay-filter="">
                                        <option value=""></option>
                                        <option value="1">消防指挥</option>
                                        <option value="2">灭火攻坚</option>
                                        <option value="3">装备维护</option>
                                        <option value="4">通信</option>
                                        <option value="5">驾驶</option>
                                    </select>
                                </div>
                            </div>
                            <div class="form-item layui-padding-2 layui-col-xs6">
                                <label class="layui-form-label">手机号码</label>
                                <div class="layui-input-block">
                                    <input type="text" name="cellphone" lay-affix="clear" lay-verify="phone" placeholder="请输入"
                                        class="layui-input">
                                </div>
                            </div>
                            <div class="form-item layui-padding-2 layui-col-xs6">
                                <label class="layui-form-label">rfid编号</label>
                                <div class="layui-input-block">
                                    <input type="text" name="rfidName" lay-affix="clear" placeholder="请输入"
                                        class="layui-input">
                                </div>
                            </div>
                            <div class="form-item layui-padding-2 layui-col-xs12">
                                <label class="layui-form-label">消防救援衔</label>
                                <div class="layui-input-block">
                                    <select name="professionalTitle" lay-filter="">
                                        <option value=""></option>
                                        <optgroup label="管理指挥">
                                            <option value="111">指挥员</option>
                                          </optgroup>
                                          <optgroup label="专业技术">
                                            <option value="201">一级消防长</option>
                                            <option value="202">二级消防长</option>
                                            <option value="203">三级消防长</option>
                                            <option value="204">一级消防士</option>
                                            <option value="205">二级消防士</option>
                                            <option value="206">三级消防士</option>
                                            <option value="207">四级消防士</option>
                                            <option value="208">预备消防士</option>
                                          </optgroup>
                                    </select>
                                </div>
                            </div>
                        </div>
                        <div class="form-item layui-padding-3 layui-col-xs6" style="margin: 0;padding-top: 0 !important;">
                            <label class="layui-form-label">受教育程度</label>
                            <div class="layui-input-block">
                                <select name="education" lay-filter="">
                                    <option value=""></option>
                                    <option value="1">本科</option>
                                    <option value="2">本科在读</option>
                                    <option value="3">高中</option>
                                    <option value="4">大专</option>
                                    <option value="5">大专在读</option>
                                    <option value="6">中专</option>
                                    <option value="7">硕士</option>
                                    <option value="8">硕士在读</option>
                                </select>
                            </div>
                        </div>
                        <div class="form-item layui-padding-3 layui-col-xs6" style="margin: 0;padding-top: 0 !important;">
                            <label class="layui-form-label">政治面貌</label>
                            <div class="layui-input-block">
                                <select name="politicalStatus" lay-filter="">
                                    <option value=""></option>
                                    <option value="1">党员</option>
                                    <option value="2">团员</option>
                                    <option value="3">群众</option>
                                </select>
                            </div>
                        </div>
                        <div class="form-item layui-padding-3 layui-col-xs6" style="margin: 0;padding-top: 0 !important;">
                            <label class="layui-form-label">入党团日期</label>
                            <div class="layui-input-block">
                                <input type="text" name="politicalTime" id="politicalTime" lay-affix="clear" placeholder="请输入"
                                    class="layui-input">
                            </div>
                        </div>
                        <div class="form-item layui-padding-3 layui-col-xs6" style="margin: 0;padding-top: 0 !important;">
                            <label class="layui-form-label">出生日期</label>
                            <div class="layui-input-block">
                                <input type="text" name="birthDate" lay-affix="clear" placeholder="请输入"
                                    class="layui-input laydate-item">
                            </div>
                        </div>
                        <div class="form-item layui-padding-3 layui-col-xs6" style="margin: 0;padding-top: 0 !important;">
                            <label class="layui-form-label">入职日期</label>
                            <div class="layui-input-block">
                                <input type="text" name="workDate" lay-affix="clear" placeholder="请输入"
                                    class="layui-input laydate-item">
                            </div>
                        </div>
                        <div class="form-item layui-padding-3 layui-col-xs6" style="margin: 0;padding-top: 0 !important;">
                            <label class="layui-form-label">休假情况</label>
                            <div class="layui-input-block">
                                <select name="vacationStatus" lay-filter="">
                                    <option value=""></option>
                                    <option value="1">驻地轮休</option>
                                    <option value="2">休假</option>
                                </select>
                            </div>
                        </div>
                        <div class="form-item layui-padding-3 layui-col-xs6" style="margin: 0;padding-top: 0 !important;">
                            <label class="layui-form-label">有无房产</label>
                            <div class="layui-input-block">
                                <select name="hasHouse" lay-filter="">
                                    <option value=""></option>
                                    <option value="2">有</option>
                                    <option value="1">无</option>
                                </select>
                            </div>
                        </div>
                        <div class="form-item layui-padding-3 layui-col-xs6" style="margin: 0;padding-top: 0 !important;">
                            <label class="layui-form-label">有无贷款</label>
                            <div class="layui-input-block">
                                <select name="hasLoan" lay-filter="">
                                    <option value=""></option>
                                    <option value="2">有</option>
                                    <option value="1">无</option>
                                </select>
                            </div>
                        </div>
                        <div class="form-item layui-padding-3 layui-col-xs6" style="margin: 0;padding-top: 0 !important;">
                            <label class="layui-form-label">婚姻情况</label>
                            <div class="layui-input-block">
                                <select name="maritalStatus" lay-filter="">
                                    <option value=""></option>
                                    <option value="1">未婚</option>
                                    <option value="2">已婚</option>
                                </select>
                            </div>
                        </div>
                        <div class="form-item layui-padding-3 layui-col-xs6" style="margin: 0;padding-top: 0 !important;">
                            <label class="layui-form-label">有无子女</label>
                            <div class="layui-input-block">
                                <select name="hasChild" lay-filter="">
                                    <option value=""></option>
                                    <option value="2">有</option>
                                    <option value="1">无</option>
                                </select>
                            </div>
                        </div>
                        <div class="form-item pane-tool layui-padding-2 layui-col-xs12" >
                            <button type="reset" class="layui-btn layui-btn-primary btn-reset">重置</button>
                            <button class="layui-btn" lay-submit lay-filter="edit">确认</button>
                        </div>
                    </form>
                </script>
            </div>
            <input style="display:none;" type="file" accept="image/jpeg" id="upload-input" />
            <canvas style="display:none;" id="canvas"></canvas>
        </div>
    </div>

    <script type="text/javascript" src="../static/js/util/jquery.min.js"></script>
    <script type="text/javascript" src="../static/js/biz/app.js"></script>
    <script type="text/javascript" src="../static/js/layui/layui.js"></script>
    <script type="text/javascript" src="../static/js/biz/firemen.js"></script>
    <script type="text/javascript" src="../static/js/util/compressPhotoUpload.min.js"></script>
</body>

</html>